﻿<template>
    <div id="app">
        <h-header :headertitle="title"></h-header>



        <div class="mui-card" v-for="item in list" @click="go(item)">
            <!--页眉，放置标题-->
            <div class="mui-card-header">{{item.title}}<span style="float:right;font-size:14px;">{{item.onlinenum}}人在线</span></div>
            <!--内容区-->
            <div class="mui-card-content" style="text-align:center;vertical-align:middle;padding-top:10px;padding-bottom:10px;background-size:cover;"  v-bind:style="{backgroundImage:'url(' + item.imgurl + ')'}">
                <img src="../assets/images/icon_play.png" alt="">

            </div>
            <!--页脚，放置补充信息或支持的操作-->
            <div class="mui-card-footer">视频开放时间  {{item.stime}}&nbsp;至&nbsp;{{item.etime}}</div>
        </div>
        


    </div>

</template>

<script>

    var time_range = function (beginTime, endTime, nowTime) {
        var strb = beginTime.split(":");
        if (strb.length != 2) {
            return false;
        }

        var stre = endTime.split(":");
        if (stre.length != 2) {
            return false;
        }

        var strn = nowTime.split(":");
        if (stre.length != 2) {
            return false;
        }
        var b = new Date();
        var e = new Date();
        var n = new Date();

        b.setHours(strb[0]);
        b.setMinutes(strb[1]);
        e.setHours(stre[0]);
        e.setMinutes(stre[1]);
        n.setHours(strn[0]);
        n.setMinutes(strn[1]);

        if (n.getTime() - b.getTime() > 0 && n.getTime() - e.getTime() < 0) {
            return true;
        } else {
            
            return false;
        }
    }


    import header from '../components/header.vue';
    import Bus from '../bus.js'
    import { Toast } from 'mint-ui';
    export default {
        name: 'app',
        data() {
            return {
                title:'视频',
                page: 1,
                list: [],
          
            }
        },
        components: {
            'h-header': header,
        },
        mounted() {
            //   this.pushHistory()
            // 监听历史记录点, 添加返回事件监听
            window.onpopstate = () => {
              
                Bus.$emit('val', "show");
                //  this.$router.back();
            }
        },
        methods:
        {
            go: function (e) {
                var id = e.id;
              
                var stime = e.stime;
                var etime = e.etime;
                var myDate = new Date();
                var hour= myDate.getHours();      
                var minute = myDate.getMinutes();
                var result = time_range(stime, etime, hour + ":" + minute);   
                if (result) {
                    Bus.$emit('val', "hide");
                    this.$router.push({ name: 'videopage', params: { id: e.id } });
                } else {
                    Toast("不在该时间范围内！");
                  
                }
       
            },
       
            load: function () {
                var mid = window.localStorage.getItem("mid");
                var page = this.$data.page;
                var _this = this;
                var studentid = window.localStorage.getItem("studentid");
                var teacherid = window.localStorage.getItem("teacherid");

                this.$api.post('wx/Index/getvideo', {
                    "mid": mid, "page": page, "studentid": studentid, "teacherid": teacherid
                }, response => {
                    if (response.status >= 200 && response.status < 300) {
                        console.log(response.data);
                        var data = response.data;
                        if (data.status == 200) {

                            if (data.data.length > 0) {
                                for (var i = 0; i < data.data.length; i++) {

                                    _this.$data.list.push(data.data[i]);
                                }


                             
                            } else {

                             
                            }
                           


                        }


                        console.log(_this.$data.list);
                        
                        //请求成功，response为成功信息参数
                    } else {
                        console.log(response.message);
                        //请求失败，response为失败信息
                    }
                });

            }
        },
        created: function () {
          this.load();
        }
        
    }
</script>

<style scoped>
    @import "../assets/css/mui.min.css";
    .loading {
        width: 100%;
        margin-bottom: 2px;
        text-align: center;
    }
</style>